<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			* {
				margin: 0 auto;
				padding: 0;
			}
			
			#rilikuang {
				/*border: 1px solid black;*/
				height: 600px;
				width: 700px;
			}
			
			.one {
				height: 50px;
				width: 698px;
				border: 1px solid black;
				text-align: center;
				font-size: 20px;
				line-height: 2em;
				background-color: gray;
				color: white;
			}
			
			.two {
				height: 400px;
				width: 700px;
			}
			
			.three {
				float: left;
				height: 98px;
				width: 98px;
				border: 1px solid black;
				margin: 0;
				text-align: center;
				line-height: 6em;
				background-color: gray;
				color: white;
			}
			
			.four {
				float: left;
				height: 98px;
				width: 98px;
				border: 1px solid black;
				margin: 0;
				text-align: center;
				line-height: 6em;
				background-color: gray;
				color: black;
			}
			
			.three:hover {
				color: red;
			}
			
			.four:hover {
				color: blue;
			}
		</style>
	</head>

	<body>
		<div id="rilikuang">
			<div class="one">2018年1月</div>
			<div class="two">
				<div class="three">日</div>
				<div class="three">一</div>
				<div class="three">二</div>
				<div class="three">三</div>
				<div class="three">四</div>
				<div class="three">五</div>
				<div class="three">六</div>
				<div class="four">31</div>
				<div class="three">1</div>
				<div class="three">2</div>
				<div class="three">3</div>
				<div class="three">4</div>
				<div class="three">5</div>
				<div class="three">6</div>
				<div class="three">7</div>
				<div class="three">8</div>
				<div class="three">9</div>
				<div class="three">10</div>
				<div class="three">11</div>
				<div class="three">12</div>
				<div class="three">13</div>
				<div class="three">14</div>
				<div class="three">15</div>
				<div class="three">16</div>
				<div class="three">17</div>
				<div class="three">18</div>
				<div class="three">19</div>
				<div class="three">20</div>
				<div class="three">21</div>
				<div class="three">22</div>
				<div class="three">23</div>
				<div class="three">24</div>
				<div class="three">25</div>
				<div class="three">26</div>
				<div class="three">27</div>
				<div class="three">28</div>
				<div class="three">29</div>
				<div class="three">30</div>
				<div class="three">31</div>
				<div class="four">1</div>
				<div class="four">2</div>
				<div class="four">3</div>

			</div>

		</div>
		</div>
	</body>

</html>